<template>
  <div class="quick-entry-box">
    <el-row :gutter="10">
      <el-col
        v-for="(item, index) in module.props.entries"
        :key="index"
        :span="getSpan(module.props.entries.length)"
      >
        <a
          class="entry"
          :href="item.link"
          target="_blank"
          rel="noopener noreferrer"
        >
          <div class="entry-title">{{ item.title }}</div>
        </a>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: "QuickEntryModule",
  props: ["module"],
  methods: {
  getSpan(count) {
    // 最少 1 个占满整行，最多 6 个，之后都占 4 (即 6列)
    if (count <= 0) return 24;
    if (count === 1) return 24;
    if (count === 2) return 12;
    if (count === 3) return 8;
    if (count === 4) return 6;
    if (count === 5) return 5;
    if (count === 6) return 4;
    return 4; // 超过6个都按4列排
  }
}

};
</script>

<style scoped>
.quick-entry-box {
  background-color: rgb(242, 246, 252); /* 与 SubjectSelectorModule 一致 */
  padding: 10px 12px;
}

.entry {
  display: block;
  text-align: center;
  padding: 10px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease;
  text-decoration: none;
  color: #333;
}

.entry:hover {
  transform: translateY(-2px);
}

.entry-title {
  font-size: 14px;
  font-weight: 500;
}
</style>
